<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>
        添加房产信息
    </title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link rel="stylesheet" href="${pageContext.request.contextPath }/statics/css/main.css" media="all">
    <script type="text/javascript" src="${pageContext.request.contextPath }/statics/lib/loading/okLoading.js"></script>
</head>
<body>
<div class="x-nav">
            <span class="layui-breadcrumb">
              <a><cite>首页</cite></a>
              <a><cite>房产管理</cite></a>
            </span>
    <a class="layui-btn layui-btn-small" style="line-height:1.6em;margin-top:3px;float:right"
       href="javascript:location.replace(location.href);" title="刷新"><i class="layui-icon"
                                                                        style="line-height:30px">ဂ</i></a>
</div>
<div class="x-body">
    <form class="layui-form layui-form-pane" method="post" id="add">
        <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
            <div class="layui-tab-content">
                <div class="layui-tab-item layui-show">
                    <input type="hidden" name="id" value="${param.id}">
                    <div class="layui-form-item">
                        <label class="layui-form-label">
                            <span class='x-red'>*</span>所属小区
                        </label>
                        <div class="layui-input-block">
                            <input type="hidden" value="" name="community_id" id="community_id"/>
                            <select name="communityId" id="communityId" lay-filter="community">
                                <option value="0">---请选择所属小区---</option>
                                <option value="1">东湖小区</option>
                                <option value="2">金华万府</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">
                            <span class='x-red'>*</span>房产名称
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="homeName" autocomplete="off" placeholder="控制在80个汉字以内"
                                   class="layui-input" value="">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">
                            <span class='x-red'>*</span>户主名称
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="householder" autocomplete="off" placeholder=""
                                   class="layui-input" value="">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">
                            <span class='x-red'>*</span>联系方式
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="phone" autocomplete="off" placeholder=""
                                   class="layui-input" lay-verify="required|phone" value="">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">
                            <span class='x-red'>*</span>栋数
                        </label>
                        <div class="layui-input-block">
                            <input type="hidden" value="" name="dongs" id="dongs"/>
                            <select name="dong" id="dong" lay-filter="building">
                                <option value="0">---请选择所属栋数---</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">
                            <span class='x-red'>*</span>楼层
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="floor" autocomplete="off" placeholder="请输入数字"
                                   class="layui-input" lay-verify="required|number" value="">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">
                            <span class='x-red'>*</span>房号
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="roomNum" autocomplete="off" placeholder="请输入数字"
                                   class="layui-input" lay-verify="required|number" value="">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">
                            <span class='x-red'>*</span>房间数
                        </label>
                        <div class="layui-input-block">
                            <input type="text" name="homeNum" autocomplete="off" placeholder="请输入数字"
                                   class="layui-input" lay-verify="required|number" value="">
                        </div>
                    </div>
                    <div class="layui-form-item">
                        <label class="layui-form-label">
                            <span class='x-red'>*</span>入住时间
                        </label>

                        <div class="layui-input-inline">
                            <input class="layui-input" name="resideDate" placeholder="入住时间" id="LAY_demorange_s"
                                   value="">
                        </div>
                    </div>
                    <div class="layui-form-item layui-form-text">
                        <label class="layui-form-label">
                            <span class='x-red'></span>描述
                        </label>
                        <div class="layui-input-block">
                            <textarea placeholder="请输入内容" name="remark" class="layui-textarea"></textarea>
                        </div>
                    </div>
                    <div class="layui-form-item" align="center">
                        <button class="layui-btn" type="button" lay-filter="add" lay-submit="">
                            保存
                        </button>

                        <button class="layui-btn" type="reset">
                            重置
                        </button>
                    </div>
                </div>
                <div style="height:50px;"></div>
            </div>
        </div>
    </form>
</div>
<script src="${pageContext.request.contextPath }/statics/lib/layui/layui.js" charset="utf-8"></script>
<script src="${pageContext.request.contextPath }/statics/js/x-layui.js" charset="utf-8"></script>
<script src="${pageContext.request.contextPath }/statics/js/jquery.min.js" charset="utf-8"></script>
<script>
    if ($("input[name='id']").val() != "") {    //根据id查询数据
        var id = $("input[name='id']").val()
        $.get("/home/" + id, function (data) {
            $("input[name='community_id']").val(data.data.communityId);
            $("input[name='homeName']").val(data.data.homeName);
            $("input[name='householder']").val(data.data.householder);
            $("input[name='phone']").val(data.data.phone);
            $("input[name='dongs']").val(data.data.dong);
            $("input[name='floor']").val(data.data.floor);
            $("input[name='roomNum']").val(data.data.roomNum);
            $("input[name='homeNum']").val(data.data.homeNum);
            $("input[name='resideDate']").val(data.data.resideDate);
            $("textarea[name='remark']").val(data.data.remark);
        })
    }

    layui.use(['laydate', 'element', 'layer', 'form'], function () {
        $ = layui.jquery;//jquery
        laydate = layui.laydate;//日期插件
        lement = layui.element();//面包导航
        layer = layui.layer;//弹出层
        form = layui.form();
        okLoading.close($);
        form.render();

        var start = {
            max: '2099-06-16 23:59:59'
        };

        document.getElementById('LAY_demorange_s').onclick = function () {
            start.elem = this;
            laydate(start);
        };

        //监听提交
        form.on('submit(add)', function (data) {
            var home_name = $("input[name='homeName']").val();
            var householder = $("input[name='householder']").val();
            if (home_name == "") {
                layer.msg('房产名称不能为空', {icon: 5, time: 2000});
                return false;
            }
            if (householder == "") {
                layer.msg('户主名称不能为空', {icon: 5, time: 2000});
                return false;
            }
            var data = data.field;

            if ($("input[name='id']").val() != "") {    //修改
                $.ajax({
                    type: "put",
                    url: "update",
                    data: data,
                    dataType: "json",
                    success: function (data) {
                        if (data.data == true) {
                            layer.msg(data.msg, {icon: 6, time: 2000}, function () {
                                window.parent.location.reload();
                                var index = parent.layer.getFrameIndex(window.name);
                                parent.layer.close(index);
                            });
                            return false;
                        }
                        else {
                            layer.msg(data.msg, {icon: 5, time: 2000});
                            return false;
                        }
                    }
                });
            }

            if ($("input[name='id']").val() == "") {    //增加
                $.ajax({
                    type: "post",
                    url: "add",
                    data: data,
                    dataType: "json",
                    success: function (data) {
                        if (data.data == true) {
                            layer.msg(data.msg, {icon: 6, time: 2000}, function () {
                                window.parent.location.reload();
                                var index = parent.layer.getFrameIndex(window.name);
                                parent.layer.close(index);
                            });
                            return false;
                        }
                        else {
                            layer.msg(data.msg, {icon: 5, time: 2000});
                            return false;
                        }
                    }
                });
            }
        });

        //加载小区列表
        $(function () {
            //动态加载所属小区列表
            $.ajax({
                url: "/community/getlist",//请求的url
                data: {state: 1},//1 表示小区状态为正常
                type: "GET",//请求类型
                dataType: "json",//ajax接口（请求url）返回的数据类型
                success: function (data) {//data：返回数据（json对象）
                    var community_id = $("#community_id").val()
                    var options = "<option value='0'>---请选择所属小区---</option>";
                    for (var i = 0; i < data.data.length; i++) {
                        if (community_id != null && community_id != undefined && data.data[i].id == community_id) {
                            options += "<option selected='selected' value=" + data.data[i].id + ">" + data.data[i].communityName + "</option>";
                        } else {
                            options += "<option value=" + data.data[i].id + " >" + data.data[i].communityName + "</option>";
                        }
                    }
                    $("#communityId").html(options);
                    form.render('select', 'community');
                    building($("#communityId").find("option:selected").val());
                },
                error: function (data) {//当访问时候，404，500 等非200的错误状态码
                    alert("加载所属小区列表失败！");
                }
            })
        });
        form.on('select(community)', function (data) {  //获取选中下拉框的data值
            building($("#communityId").find("option:selected").val());
        });

        //动态加载栋数
        function building(communityId) {
            if (communityId != 0) {
                $.ajax({
                    type: "GET",//请求类型
                    url: "/community/" + communityId,//请求的ur
                    dataType: "json",//ajax接口（请求url）返回的数据类型
                    success: function (data) {//data：返回数据（json对象）
                        var dongs = $("#dongs").val()
                        var options = "<option value=\"0\">---请选择所属栋数---</option>";
                        for (var i = 1; i <= data.data.dong; i++) {
                            if (dongs != null && dongs != undefined && i == dongs) {
                                options += "<option selected='selected' value=" + i + ">" + i + "栋</option>";
                            } else {
                                options += "<option value=" + i + ">" + i + "栋</option>";
                            }
                        }
                        $("#dong").html(options);
                        form.render('select', 'building');
                    },
                    error: function (data) {//当访问时候，404，500 等非200的错误状态码
                        alert("加载栋数失败！");
                    }
                });
            } else {
                var options = "<option value=\"0\">---请选择所属栋数---</option>";
                $("#dong").html(options);
                form.render('select', 'building');
            }
        }
    })
</script>
</body>
</html>